<!DOCTYPE html>
<html lang="en">

<head>
	<title>从心出发，服务到家</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">

	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/main.css?v=017">
	<script src="mjs/vconsole.js?v=3.2.0"></script>
	<script>
		// window.vConsole = new window.VConsole({
		// 	defaultPlugins: ['system', 'network', 'element', 'storage'], // 可以在此设定要默认加载的面板
		// 	maxLogNumber: 1000,
		// 	// disableLogScrolling: true,
		// 	onReady: function () {
		// 		console.log('vConsole is ready.');
		// 	},
		// 	onClearLog: function () {
		// 		console.log('on clearLog');
		// 	}
		// });
	</script>
</head>


<body>

	<img style="display:none;" src="share.jpg" />
	<p style="display:none"></p>

	<div class="loadingback">
		数据加载中
		<embed src="images/loading.svg"
			style="display:block;width:160px;height:20px; transform: scale(0.6); margin-top:20px;"
			viewBox="0 0 660 342" />
	</div>

	<div class="w1">

		<div class="swiper-container sc1" id="sc1">
			<div class="swiper-wrapper sw1">
				<div class="swiper-slide  one swiper-no-swiping">
					<img src="./images/hert.png" alt="" class="hert cartoon">
					<img src="./images/text01.png" alt="" class="text01 cartoon">
					<img src="./images/text04.png" alt="" class="text04 cartoon">
					<img src="./images/text02.png" alt="" class="text02 cartoon">
					<img src="./images/text03.png" alt="" class="text03 cartoon">
					<img src="./images/head.png" alt="" class="head cartoon">
					<img src="./images/but01.png" alt="" class="but01 cartoon">
				</div>
				<div class="swiper-slide ss1 swiper-no-swiping">
					<div class="mdiv">

						<div class="mdivmid">
							<!--照片-->
							<div class="domain">
								<div class="imgarea">

									<div class="imgback">

										<div class="text0"></div>
										<div class="text1"></div>

									</div>

								</div>
								<img src="./images/pic.png" alt="" class="pic">
								<img src="./images/er.png" alt="" class="er" id="er">
								<!--<img src="./images/tele.png" alt="" class="pic" style="margin-top: 0.5rem;z-index: 3;">-->
								<!--<div class="tele">-->
								<!--张三 <br/>-->
								<!--15121343567-->

								<!--</div>-->

								<!--编号-->
								<div class="numbers" id="numbers">

								</div>


								<!--<div class="inputarea">-->
								<!--<input id="uname" placeholder="姓名" type="text">-->
								<!--<input id="utel" placeholder="联系电话" type="number">-->
								<!--</div>-->


								<div id="container"></div>


								<div class="loading">
									<div class="loadtext">LOADING</div>
									<embed src="images/loading.svg"
										style="display:block;width:160px;height:20px; transform: scale(0.6); margin-top:20px;"
										viewBox="0 0 660 342" />
								</div>





								<div id="qrcode">
								</div>
							</div>
							<!--框-->
							<div class="kuang">
								<img src="./images/kuang.png" alt="">
							</div>
							<div class="swiper-container sc2">
								<div class="swiper-wrapper sw2">
								</div>
							</div>
							<div class="swiper-button-next t"
								style="position:absolute; background-image:url(images/jt.png); transform: rotateZ(180deg); right:1.5rem; top:10rem; width: 1.5rem; height: 2.5rem; background-size:100% 100%;">
							</div>
							<div class="swiper-button-prev t"
								style="position:absolute; background-image:url(images/jt.png); left:1.5rem; top: 10rem; width: 1.5rem; height: 2.5rem; background-size:100% 100%;">
							</div>
							<!--<div class="magtext">点击选择模版</div>-->
							<div class="row">
								<div class="but02 upload" id="framedof">
									<input type="file" name="uploadimg" accept="image/*" id="uploadimg" />
								</div>
								<div class="but03" onclick="subm()">

								</div>
							</div>

						</div>


						<div class="vclass"></div>
					</div>
				</div>
				<div class="swiper-slide ss1 swiper-no-swiping cameras">
					<div id="showimage">
						<!--<img src="images/gongxi.png" style="margin-bottom:1rem; margin-top:1.1rem; width:16rem" />-->
						<img id="canvasimage" src="" />
						<div class="magtext"></div>
						<!--<div id="cols" onclick="colss()">-->
						<!--</div>-->
						<div class="row" style="width:19rem">
							<div class="but04" onclick="sharetext()">

							</div>
							<div class="but05" onclick="newopen()">

							</div>
						</div>



					</div>
					<div id="closethis" onclick="closethis()">

					</div>
				</div>
				<div class="swiper-slide ss1 swiper-no-swiping cameras ss4">
					<img src="./images/head.png" alt="" class="hand">

					<img src="./images/celebrate.png" alt="" class="celebrate">
					<img src="./images/but06.png" alt="" class="but06" onclick="newopen()">
				</div>
			</div>
			<!-- Add Scroll Bar -->
			<!--<div class="swiper-scrollbar"></div>-->
		</div>



		<!--<div class="domain">-->

		<!--<div class="imgarea">-->

		<!--<div class="imgback">-->

		<!--<div class="text0"></div>-->
		<!--<div class="text1"></div>-->

		<!--</div>-->

		<!--</div>-->

		<!--<div class="tools">-->
		<!--&lt;!&ndash;<div class="upload button" id="framedof">&ndash;&gt;-->
		<!--&lt;!&ndash;<input type="file" name="uploadimg" accept="image/*" id="uploadimg" />&ndash;&gt;-->
		<!--&lt;!&ndash;</div>&ndash;&gt;-->

		<!--<div class="submit button" onclick="subm()">-->
		<!--生成图片-->
		<!--</div>-->
		<!--</div>-->

		<!--<div class="inputarea">-->
		<!--<input id="uname" placeholder="姓名" type="text">-->
		<!--<input id="utel" placeholder="联系电话" type="number">-->
		<!--</div>-->


		<!--<div id="container"></div>-->

		<!--<div id="showimage">-->
		<!--<img src="images/gongxi.png" style="margin-bottom:1rem; margin-top:1.1rem; width:16rem" />-->
		<!--<img id="canvasimage" src="" />-->
		<!--<div class="magtext">长按保存图片</div>-->
		<!--<div id="cols" onclick="colss()">-->
		<!--</div>-->
		<!--</div>-->

		<!--<div class="loading">-->
		<!--<div class="loadtext">LOADING</div>-->
		<!--<embed src="images/loading.svg"-->
		<!--style="display:block;width:160px;height:20px; transform: scale(0.6); margin-top:20px;"-->
		<!--viewBox="0 0 660 342" />-->
		<!--</div>-->



		<!--<div id="closethis" onclick="closethis()">-->

		<!--</div>-->


		<!--<div id="qrcode">-->
		<!--</div>-->


		<!--</div>-->
	</div>
	<!--分享-->
	<div class="sharetext" onclick="shareclose()">
		<img src="./images/share01.png" alt="">
	</div>
	<div class="hint">
		<img src="./images/hint.png" alt="">
	</div>

	<script src="js/jquery-1.8.3.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="exif-js/exif.js"></script>
	<!-- <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> -->
	<!-- <script src="wxchat.js"></script> -->
	<script src="mjs/upload.js?v=031"></script>
	<script src="mjs/qrcode.min.js"></script>

	<!-- Swiper JS -->
	<!--<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>-->
	<script src="js/swiper.min.js"></script>

	<!-- Initialize Swiper -->
	<script>
		//		$('body').on('touchmove', function (event) {
		//			event.preventDefault();
		//		});

		document.body.addEventListener('touchmove', function (e) {
			e.preventDefault(); //阻止默认的处理方式(阻止下拉滑动的效果)
		}, {
			passive: false
		});

		// var swiper = new Swiper('#sc0');
		var swiper2;
		var swiper = new Swiper('#sc1', {
			initialSlide: 0,
			direction: 'vertical',
			// slidesPerView: 'auto',
			freeMode: true,
			noSwiping: true,
			effect: 'fade',
			touchRatio: 0, //触摸变慢
			mousewheel: false,
			scrollbar: {
				// el: '.swiper-scrollbar',
			},
			// mousewheel: true,
			on: {
				setTranslate: function (translate) {
					// console.log(translate);
				},
			},


		});

		$('.but01').click(function () {
			swiper.slideTo(1, 200, false); //切换到选择模板
		})





		// var title = '从心出发，服务到家',
		// 	desc = "千万红包雨100%中奖，邀您一起为平安服务打Call……",
		// 	title2 = '从心出发，服务到家',
		// 	link = 'https://hjw.lnmywl.com/h5/pingan-posters/index.html',
		// 	imgUrl = 'https://hjw.lnmywl.com/h5/pingan-posters/images/share.jpg';


		// function share() {

		// 	var wechat = new Wechat('wx10adccf0b4a5866f');
		// 	wechat.config({
		// 		debug: false,

		// 	});

		// 	// 			wx.onMenuShareTimeline({
		// 	// 				title: title, // 分享标题
		// 	// 				desc: desc, // 分享描述
		// 	// 				link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
		// 	// 				imgUrl: imgUrl, // 分享图标
		// 	// 				success: function () {
		// 	// 					// 用户点击了分享后执行的回调函数
		// 	// 					swiper.slideTo(3, 1000, false);//切换到一键领取
		// 	//
		// 	//
		// 	// 				},
		// 	// 			});
		// 	//
		// 	// 			wx.onMenuShareAppMessage({
		// 	// 				title: title, // 分享标题
		// 	// 				desc: desc, // 分享描述
		// 	// 				link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
		// 	// 				imgUrl:imgUrl , // 分享图标
		// 	// 				type: link, // 分享类型,music、video或link，不填默认为link
		// 	// 				success: function () {
		// 	// // 用户点击了分享后执行的回调函数
		// 	// 					swiper.slideTo(3, 1000, false);//切换到一键领取
		// 	//
		// 	// 				}
		// 	// 			});




		// 	wechat.shareFriend({
		// 			appmessageTitle: title,
		// 			appmessageDesc: desc,
		// 			link: link,
		// 			imgUrl: imgUrl,
		// 		},


		// 		function () {
		// 			try {
		// 				shareclose();
		// 				swiper.slideTo(3, 1000, false); //切换到一键领取

		// 				// alert(13);
		// 				_czc.push(['_trackEvent', '从心出发，服务到家', '分享给好友', '分享-' + dataindex, dataindex, 'shareFriend']);
		// 			} catch (e) {
		// 				alert(e);
		// 			}
		// 		});

		// 	wechat.shareTimeline({
		// 		timelineTitle: title2,
		// 		link: link,
		// 		imgUrl: imgUrl
		// 	}, function () {
		// 		try {

		// 			shareclose();

		// 			swiper.slideTo(3, 1000, false); //切换到一键领取

		// 			_czc.push(['_trackEvent', '从心出发，服务到家', '分享到朋友圈', '分享到朋友圈-' + dataindex, dataindex,
		// 				'shareFriend'
		// 			]);

		// 		} catch (e) {

		// 		}
		// 	});

		// }


		function temporaryRepair() {
			var currentPosition, timer;
			var speed = 1; //页面滚动距离
			timer = setInterval(function () {
				currentPosition = document.documentElement.scrollTop || document.body.scrollTop;
				currentPosition -= speed;
				window.scrollTo(0, currentPosition); //页面向上滚动
				currentPosition += speed; //speed变量
				window.scrollTo(0, currentPosition); //页面向下滚动
				clearInterval(timer);
			}, 1);
		}

		var qrcode;

		var backgroundimage = "images/m/0.png";

		var data;

		var dataindex = 0;

		var err = "images/er.png";

		var numbers = "W1005342";


		window.onload = function () {

			$(document).ready(function () {





				// numbercoding = Math.floor(Math.random()*10000);

				numbercoding = Math.random().toString(15).substr(2).slice(2, 9).toUpperCase();


				console.log('随机数', numbercoding);

				numbers = 'W1' + numbercoding;

				$('#numbers').html(numbers);

				console.log('w随机数', numbers);



				var fontsize = 15 * (window.innerWidth / 375);

				$("html").css("font-size", fontsize + "px");


				var listhtml = '';

				data = [{
						title: "",
						img0: "images/b/0.png",
						img1: "images/m/0.png",
						text0: "",
						text1: ""
					},
					{
						title: "",
						img0: "images/b/1.png",
						img1: "images/m/1.png",
						text0: "",
						text1: ""
					},
					{
						title: "",
						img0: "images/b/2.png",
						img1: "images/m/2.png",
						text0: "",
						text1: ""
					},
					{
						title: "",
						img0: "images/b/3.png",
						img1: "images/m/3.png",
						text0: "",
						text1: ""
					}
					// { title: "", img0: "images/b/4.png", img1: "images/m/4.png", text0: "", text1: "" }
				];

				console.log(data);
				for (var i = 0; i < data.length; i++) {
					listhtml += '<div class="swiper-slide"><div class="item p' + i + '" imgurl="' + data[i].img1 +
						'" index="' + i + '" style="background-image:url(' + data[i].img0 + ');"></div></div>'
				}
				$(".sw2").html(listhtml);
				swiper.update();

				swiper2 = new Swiper('.sc2', {
					spaceBetween: 40,
					loop: true,
					// autoplay: {
					// 	delay: 2500,
					// 	disableOnInteraction: false,
					// },
					navigation: {
						nextEl: '.swiper-button-next',
						prevEl: '.swiper-button-prev',
					},
				});

				editphoto = true;
				$(".loadingback").fadeTo(500, 0, function () {
					$(this).hide();
					$('.cartoon').addClass('now');
				})

				// init();
				// share();
				qrcode = new QRCode('qrcode', {
					text: '123',
					width: 130,
					height: 130,
					typeNumber: 8,
					colorDark: '#000000',
					colorLight: '#ffffff',
					correctLevel: QRCode.CorrectLevel.Q
				});

				//
				// $(document).on("click", ".item", function () {
				// 	$(".domain").css("display", "flex");
				// 	dataindex = $(this).attr("index");
				//
				// 	var imgurl = $(this).attr("imgurl")
				//
				// 	$(".imgback").css("background-image", "url(" + imgurl + ")");
				//
				// 	backgroundimage = imgurl;
				//
				// })

				/********************/
				$(document).on("click", ".t", function () {
					setTimeout(function () {
						realindex = swiper2.realIndex;

					}, 500);

					// $(".domain").css("display", "flex");
					setTimeout(function () {

						dataindex = $('.p' + realindex).attr("index");

						var imgurl = $('.p' + realindex).attr("imgurl")

						// $(".imgback").css("background-image", "url(" + imgurl + ")");

						backgroundimage = imgurl;


					}, 500);



					setTimeout(function () {
						console.log('当前第' + swiper2.realIndex)

					}, 500);


				})

				/********************/




				$(".goselect").click(function () {
					swiper.setTransition(500);
					swiper.setTranslate(-900);
				})

				$("input").blur(function () {
					temporaryRepair();
				});

				$("#uname").on('input propertychange', function () {
					console.log($(this).val());
					var val = $(this).val();
					$(".text0").html(val);

					data[dataindex].text0 = val;
				})

				$("#utel").on('input propertychange', function () {
					console.log($(this).val());
					var val = $(this).val();
					$(".text1").html(val);

					data[dataindex].text1 = val;
				})
			})






		}



		var stoprender = true,
			stoprender2 = true,
			infodata = [],
			editphoto = false;

		var objects = [];

		var camera, camera2, scene, scene2, group2, renderer, renderer2, materialpary = [],
			meshary = [];

		function loadingtext(count) {
			var text = "LOADING";
			var dot = "";
			for (var i = 0; i < count; i++) {
				dot = dot + ".";
			}
			count++
			if (count > 6) {
				count = 0;
			}
			text = text + dot;
			$(".loadtext").html(text);
			setTimeout(() => {
				loadingtext(count);
			}, 300);
		}

		var uploadimg = false;

		function isCanvasBlank(canvas) {
			var blank = document.createElement('canvas'); //系统获取一个空canvas对象
			blank.width = canvas.width;
			blank.height = canvas.height;
			return canvas.toDataURL() == blank.toDataURL(); //比较值相等则为空
		}

		function subm() {


			var name = $.trim($('#names').val());
			var section = $.trim($('#section').val());
			var manifesto = $.trim($('#manifesto').val());

			// console.log('$("#photo").attr("src"):', $("#photo").attr("src"));

			if (!uploadimg) {

				// alert("请上传照片");

				$(".hint").fadeIn(400, 0, function () {
					setTimeout(function () {
						$(".hint").fadeOut(400, 0);
						// $(".hint").css('display','none');

					}, 800);
				});


			} else {

				// loadingtext(0);
				$(".loading").css("top", "0%");

				saveAsLocalImage2();

				// $.get('https://cdn.moheweb.com/pingan/21/add.php?', {
				// 	// uname:encodeURIComponent(username),
				// 	// utel:encodeURIComponent(userphonenumber),
				// 	uno: encodeURIComponent(numbers),

				// }, function (data) {
				// 	console.log(data);
				// })


			}
		}


		function newopen() {
			// window.location.replace(
			// 	"//ulink.lifeapp.pingan.com.cn/index.html?url=pars%3A%2F%2Fpars.pingan.com%2Fopen_url%3Furl%3Dhttps%253A%252F%252Fals.cdn.lifeapp.pingan.com.cn%252Felis_smp_als_dmz%252Fact-base%252Fsign-up%252Findex.html%253Faid%253D20190201618375%2526redirectUri%253Dhttps%25253A%25252F%25252Fc.wufae.com%25252FPingan%25252Fsqservice%25252F%26type%3Djssdk"
			// );
			alert('本次活动已经结束,项目合作请联系工程师:tyinweb@163.com');
		}


		function cols() {
			$('#cols').css('display', 'block');
			$('#cols').css('z-index', '9999');
		}


		function colss() {
			$("#loading").fadeTo(300, 0, function () {
				$(this).css("display", "none");
			})
			$("#showimage").fadeTo(300, 0, function () {
				$(this).css("display", "none");
			})
		}

		function closethis() {
			swiper.slideTo(1, 1000, false); //切换到上传照片

		}


		function sharetext() {
			$(".sharetext").css("display", "block");

		}

		function shareclose() {
			$(".sharetext").css("display", "none");

		}
	</script>


	<div style="display:none;">
		<!-- <img src="images/m/1.png" />
		<img src="images/m/2.png" /v
		<img src="images/m/3.png" />
		<img src="images/m/4.png" />
		<img src="images/m/0.png" />

		<img src="images/b/0.png" />
		<img src="images/b/1.png" />
		<img src="images/b/2.png" />
		<img src="images/b/3.png" />
		<img src="images/b/4.png" /> -->
	</div>


</body>

</html>
<!-- <script type="text/javascript" src="https://s23.cnzz.com/z_stat.php?id=1276802596&web_id=1276802596"></script> -->